<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<link rel='stylesheet' href='/stylesheets/style.css' />
<link rel="stylesheet" href="/javascripts/jquery/ui/development-bundle/themes/base/jquery.ui.all.css">
<script src="/javascripts/jquery/ui/js/jquery-1.9.1.js"></script>
<script src="/javascripts/jquery/ui/js/jquery-ui-1.10.3.custom.js"></script>

<!-- ueditor -->
<script type="text/javascript" charset="utf-8" src="/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="/ueditor/editor_api.js"></script>
</head>
<body>
<div id="top" style="position:absolute;left:5px;right:5px;top:5px;right:5px;height:80px;background-color:green;" class="ui-corner-all">
<img src="/images/log.png" style="width:500px;height:100%;"/>
</div>
<div id="center" style="position:absolute;left:5px;top:90px;right:5px;;bottom:50px;border: 1px solid green;" class="ui-corner-all">
	<form action="/notes/add" method="post">
		<div style="width:100%;height:30px;">
			<label for="title" style="position:absolute;left:5px;width:30px;top:5px;"><b>Title</b></label>
			<input id="title" name="title" type="text" value="" style="position:absolute;left:40px;top:2px;right:5px;border:1px solid green;" class="ui-corner-all"/>
		</div>
		<div id="content" style="position:absolute;left:5px;top:30px;right:5px;;bottom:50px;border: 1px solid green;">
			<script type="text/plain" id="noteEditor" name="content">
				<p>please input some value</p>
			</script>
		</div>
		<div style="position:absolute;left:5px;right:5px; bottom:5px;height:40px;border:1px solid green;s">
			<input class="submit" type="submit" value="submit"/>
		</div>
	</form>
</div>
<div id="bottom" style="position:absolute;left:5px;right:5px;bottom:5px;height:40px;border: 1px solid green;text-align:center;" class="ui-corner-all">
	<%include bottom%>
</div>
<script type="text/javascript">
	var ueditor;
	var width = $("#content").width()-5;
	var height = $("#content").height()-35;
	function initEditor(){
		ueditor = UE.getEditor('noteEditor',{
			toolbars:[['fullscreen','undo', 'redo', '|',
			'bold', 'italic', 'underline', 'forecolor', 'backcolor', '|',
			'fontfamily', 'fontsize', '|',
			'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|','insertimage']], 
			initialFrameWidth:width,
			initialFrameHeight:height,
			wordCount:false,
			elementPathEnabled:false,
			autoHeightEnabled:false
		});
	}
	function initSize(){
		width = $("#content").width();
		height = $("#content").height();
		if(ueditor != undefined){
			$("#edui1").css("width", width);
			$("#edui1_iframeholder").css("width",width);
			$("#edui1_iframeholder").css("height",height - $("#edui1_toolbarbox").height());
		}
	}
	if(ueditor == undefined){
		initEditor();
	}
	$(window).resize(function(){
		initSize();
	});
	$(function(){
		$(".submit").button().click(function(){
			if(ueditor != undefined){
				alert(ueditor.getContent());
			}
			else{
				alert("页面有问题");
			}
		});
	});
</script>
</body>
</html>